<template>
  <div class="app-container">
    <el-card class="filter-container" shadow="never">
      <div>
        <i class="el-icon-search"></i>
        <span>筛选搜索</span>
        <el-button
          style="float: right"
          @click="handleSearchList()"
          type="primary"
          size="small"
        >
          查询结果
        </el-button>
        <el-button
          style="float: right; margin-right: 15px"
          @click="handleResetSearch()"
          size="small"
        >
          重置
        </el-button>
      </div>
      <div style="margin-top: 15px">
        <el-form
          :inline="true"
          :model="searchExpressList"
          size="small"
          label-width="140px"
        >
        <el-form-item label="快递单号:">
            <el-input
              style="width: 203px"
              v-model="searchExpressList.courierId"
              placeholder="请输入要搜索的快递单号"
              clearable
            ></el-input>
          </el-form-item>

        </el-form>
      </div>
    </el-card>
    <el-card style="margin-top: 15px" class="operate-container" shadow="never">
      <i class="el-icon-tickets"></i>
      <span>数据列表</span>

    </el-card>
    <div style="margin-top: 15px" class="table-container">
      <el-table :data="ExpressList" style="width: 100%" height="260px" border>
        <el-table-column type="selection" width="60" align="center"></el-table-column>
        
        <el-table-column label="快递单号" width="250" align="center">
          <template slot-scope="scope">{{ scope.row.courierId }}</template>
        </el-table-column>
        <el-table-column label="寄件人" width="125" align="center">
          <template slot-scope="scope">{{ scope.row.sender.username }}</template>
        </el-table-column>
        <el-table-column label="类型" width="125" align="center">
          <template slot-scope="scope">
            <p v-if="scope.row.type == '0'">书籍</p>
              <p v-else-if="scope.row.type == '1'">衣物</p>
              <p v-else-if="scope.row.type == '2'">日常用品</p>
              <p v-else-if="scope.row.type == '3'">食品</p>
              <p v-else-if="scope.row.type == '4'">家用电器</p>
              <p v-else-if="scope.row.type == '5'">电子器件</p>
              <p v-else-if="scope.row.type == '6'">易碎品</p>
              <p v-else-if="scope.row.type == '7'">信件</p>
              <p v-else>其他</p>
          </template>
        </el-table-column>
        <el-table-column label="状态" width="125" align="center">
          <template slot-scope="scope">
            <el-tag type="info" v-if="scope.row.status == '1'">已揽件</el-tag>
            <el-tag type="info" v-else-if="scope.row.status == '2'">已发货</el-tag>
            <el-tag type="info" v-else-if="scope.row.status == '3'">运输中</el-tag>
            <el-tag type="info" v-else-if="scope.row.status == '4'">派送中</el-tag>
            <el-tag type="warning" v-else-if="scope.row.status == '5'">待取件</el-tag>
            <el-tag type="success" v-else-if="scope.row.status == '6'">已签收</el-tag>
            <el-tag type="danger" v-else-if="scope.row.status == '-1'">丢失 </el-tag>
            <el-tag type="warning" v-else-if="scope.row.status == '-2'">已取消</el-tag>
            <el-tag type="warning" v-else-if="scope.row.status == '-3'">取件失败</el-tag>
            <el-tag type="info" v-else>待揽件</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="紧急程度" width="120" align="center">
          <template slot-scope="scope">
            <el-tag type="info" v-if="scope.row.urgency == '0'">标快</el-tag>
            <el-tag type="" v-else>特快</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="寄件时间" width="250" align="center">
          <template slot-scope="scope">{{ scope.row.createTime }}</template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="200" align="center">
        <template slot-scope="scope">
            <el-button
              size="mini"
              type="primary"
              
              @click="
                (expressDeliveryDialogVisible = true),handleDelivery( scope.row.courierId)
              "
              >快递分派
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      
    </div>
    <div class="block">
        <el-pagination
          @current-change="handleCurrentChange"
          layout="prev, pager, next"
          :page-count="pageCunt"
          :current-page.sync="currentPage"
        >
        </el-pagination>
    </div>
  </div>
</template>
<script>
export default {
  name: "expressManage",
  data() {
    return {
      expressDelivery:{
        courierId:"",
        pageNum: "1",
        pageSize: "5",
      },
      currentPage:1,
      searchExpressList: {
        courierId:"",
        pageNum: "1",
        pageSize: "5",
      },
      ExpressList: [],
      currentExpressList: {
          courierId: "",
          createTime: "",
          status: "",
          type: "",
          urgency: "",
          pageNum: "1",
          pageSize: "5",
      },
      
      
      listLoading: true,
      expressDeliveryDialogVisible: false,
      pageCunt: 1,
    };
  },
  created() {
    this.getList()
  },
  methods: {
    handleSuccess(response, file, fileList) {
    },
    getList() {
      this.axios
        .get("api/auth/networkAdmin/courier/listDelivery?pageNum=1&pageSize=5")
        .then((response) => {
          console.log(response)
          if (response.data.code == "200") {
            this.ExpressList = response.data.value.data;
            if (
              response.data.value.total / 5 >
              Number.parseInt(response.data.value.total / 5)
            ) {
              this.pageCunt =
                Number.parseInt(response.data.value.total / 5) + 1;
            } else {
              this.pageCunt = Number.parseInt(response.data.value.total / 5);
            }
            this.currentPage=1
          } else {
            this.$message.error(response.data.message);
          }
          this.listLoading = false;
        })
        .catch((error) => {
          this.$message.error("无法获取数据");
          this.listLoading = false;
        });
    },
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then((_) => {
          done();
        })
        .catch((_) => { });
    },
    handleResetSearch() {
      this.searchExpressList ={
        courierId:"",
        pageNum: "1",
        pageSize: "5",
      };
    },
    handleCurrentChange(val) {
      this.listLoading = true;
      this.currentExpressList.pageNum = val;
      this.axios
        .get("api/auth/networkAdmin/courier/listDelivery?pageNum="+val+"&pageSize=5")
        .then((response) => {
          this.ExpressList = response.data.value.data;
          this.listLoading = false;
        })
        .catch((error) => {
          this.$message.error("无法获取数据");
          this.listLoading = false;
        });
    },
    handleDelivery(courierId) {
          console.log("2332");
          this.$confirm("请再次确认是否选择分派")
            .then((_) => {
              this.axios
                .get(
                  "api/auth/networkAdmin/courier/delivery?courierId=" +
                  courierId 
                )
                .then((response) => {
                  console.log(response);
                  if (response.data.code == "200") {
                    this.$message({
                      message: "分派成功",
                      type: "success",
                    });
                    this.getList();
                    this.statusEditDialogVisible = false;
                  } else {
                    this.$message.error(response.data.message);
                  }
                })
                .catch((error) => {
                  this.$message.error("分派失败");
                });
            })
            .catch((_) => {});
    },
    handleSearchList() {
      this.listLoading = true;
      this.axios
        .get("api/auth/networkAdmin/courier/listDelivery?courierId=" +
                      this.searchExpressList.courierId +
                      "&pageNum=1&pageSize=5"
                  )
        .then((response) => {
          console.log(response)
          if (response.data.code == "200") {
            this.ExpressList = response.data.value.data;
            if (
              response.data.value.total / 5 >
              Number.parseInt(response.data.value.total / 5)
            ) {
              this.pageCunt =
                Number.parseInt(response.data.value.total / 5) + 1;
            } else {
              this.pageCunt = Number.parseInt(response.data.value.total / 5);
            }
            this.currentPage = 1
          } else {
            this.$message.error(response.data.message);
          }
          this.listLoading = false;
        })
        .catch((error) => {
          this.$message.error("无法获取数据");
          this.listLoading = false;
        });
    },
  },
};

</script>
<style>

</style>


